<template>
  <div class="ybl x">
    <zbl :buttons="buttons" :tree="tree" :CheckBox="'显示0需求'" @change="change" style="z-index:1" />
    <div class="ybl hf">
      <yblProject :statistic="statistic" :data="items" />
    </div>
    <create :fshow="show" v-model="form" @change="setTree" />
  </div>
</template>
<script>
// import name from "./name";
import zbl from "../components/zbl";
import yblProject from "../components/yblProject";
import ut from "../components/selectProject";
import create from "../components/create/projectCreate";

import XLSX from "xlsx";

export default {
  components: { zbl, create, yblProject, ut },
  props: [],
  watch: {
    gd(a) {
      this.setTree(a);
    }
  },
  data() {
    return {
      tt: [6],
      buttons: [
        {
          id: 1,
          name: "新增项目",
          Attributes: { size: "mini", type: "primary" },
          style: "",
          class: "m10px"
        },
        {
          id: 2,
          name: "修改项目",
          Attributes: { size: "mini", type: "primary", disabled: true },
          style: "",
          class: "m10px"
        },
        {
          id: 3,
          name: "新增车列",
          Attributes: { size: "mini", type: "primary", disabled: true },
          style: "",
          class: "m10px"
        },
        {
          id: 4,
          name: "修改车列",
          Attributes: { size: "mini", type: "primary", disabled: true },
          style: "",
          class: "m10px"
        },
        {
          id: 5,
          name: "导出全部",
          Attributes: { size: "mini", type: "danger", plain: true },
          style: "",
          class: "m10px"
        },
        {
          id: 6,
          name: "导出选中",
          Attributes: {
            size: "mini",
            type: "success",
            plain: true,
            disabled: true
          },
          style: "",
          class: "m10px"
        }
      ],
      tree: [],
      show: false,
      form: [
        {
          name: "厦门3号线",
          info: [
            {
              name: "列1",
              userType: "装配一车间",
              items: [
                {
                  process: "工序1",
                  uid: "111",
                  name: "物料1",
                  model: "型号",
                  sum: "100"
                },
                {
                  process: "工序2",
                  uid: "112",
                  name: "物料2",
                  model: "型号",
                  sum: "102"
                }
              ]
            },
            {
              name: "列2",
              userType: "装配二车间",
              items: [
                {
                  process: "工序1",
                  uid: "111",
                  name: "物料1",
                  modle: "型号",
                  sum: "100"
                },
                {
                  process: "工序2",
                  uid: "112",
                  name: "物料2",
                  modle: "型号",
                  sum: "102"
                }
              ]
            }
          ]
        },
        {
          name: "厦门4号线",
          info: [
            {
              name: "列11",
              userType: "装配三车间",
              items: [
                { process: "工序3", uid: "111", name: "物料1", sum: "311" },
                { process: "工序3", uid: "112", name: "物料2", sum: "312" }
              ]
            }
          ]
        }
      ],
      sData: {
        cmd: 0,
        val: {
          token: sessionStorage.token,
          table: "project"
        }
      },
      current: {
        info: []
      },
      percentage: 10,
      statistic: { i: [[], [], [], []], p: [0, 0, 0, 0] },
      items: [],
      show0: false
    };
  },
  // computed() {return{}},
  created() {
    if (this.$gd.project) this.setTree();
  },
  methods: {
    change(a, b, c) {
      let tmp = {};
      let t = {};
      let time = 0;
      if (a > 0 && a < 4) this.form = [];
      switch (a) {
        case 0: // 数据修改
          console.log(this.$cp(b));
          break;
        case 1: // 新增顶级
          // 前面已经赋值.
          break;
        case 2: // 修改项目
          this.form = this.current;
          break;
        case 3: // 新增车列
          this.form = {
            pid: this.current.id,
            items: [],
            userType: this.$gd.me.userType
          };
          break;
        case 4: // 修改车列
          this.form = {
            id: this.current.id,
            pid: this.current.pid,
            name: this.current.name,
            userType: this.current.userType,
            other: this.current.other,
            state: this.current.state,
            items: this.$cp(
              this.items
              // this.current.info.filter(a => {
              //   return a.depository == 0;
              // })
            )
          };
          // console.log(this.$cp(this.items));
          // return;
          break;
        case 5: // 导出全部
          this.export(0);
          break;
        case 6: // 导出选中
          this.export(this.current.id);
          break;
        case 101: // 选中
          if (b) {
            this.current = b;
          } else b = this.current;
          if (!this.current.id) return;

          this.statistic = { i: [[], [], [], []], p: [0, 0, 0, 0] };
          for (let t = 1; t < this.buttons.length; t++) {
            if (this.buttons[t].id === 5) continue;
            else if (b.pid) this.buttons[t].Attributes.disabled = t < 3;
            else this.buttons[t].Attributes.disabled = t > 2;
          }
          if (!this.current.pid) {
            // 选择了项目
            this.items = [];
            return;
          }
          // if (this.current == b && this.items.length) return;
          this.items = [];
          t = [];
          this.$gd.stock.map(a => {
            if(!a.name){
              tmp=this.$gd.items.getItem({id:a.item});
              Object.assign(a,{
                name:tmp.name,
                modle:tmp.modle,
                uid:tmp.uid
              });
            }
            if (a.project == this.current.id) {
              if (a.depository) {
                t.push(a);
              } else {
                this.items.push(a);
              }
            }
          });

          this.items.map(item => {
            // item.sum = 0;
            item.arrived = 0;
            item.use = 0;
            item.stock = 0;
            t.map(a => {
              if (a.item == item.item && a.process == item.process) {
                // item.sum += a.sum;
                item.arrived += a.arrived;
                item.use += a.use;
                item.stock += a.stock;
              }
            });
          });
          this.statistic = { i: [[], [], [], []], p: [0, 0, 0, 0] };
          this.items.map(a => {
            if (a.sum) {
              if (a.sum <= a.arrived) {
                // 来齐
                console.log(this.$cp(a));
                this.statistic.p[0]++;
                this.statistic.i[0].push(a);
              }
              if (a.sum > a.arrived && a.arrived > 0) {
                // 未齐
                this.statistic.p[1]++;
                this.statistic.i[1].push(a);
              }
              if (a.arrived <= 0) {
                // 未到
                this.statistic.p[2]++;
                this.statistic.i[2].push(a);
              }
              if (a.sum <= a.use) {
                // 出库
                this.statistic.p[3]++;
                this.statistic.i[3].push(a);
              }
            }
          });
          if (this.items.length) {
            for (let i = 0; i < this.statistic.p.length; i++) {
              this.statistic.p[i] = parseInt(
                (this.statistic.p[i] / this.items.length) * 100
              );
            }
          }
          // console.log(this.$cp(this.statistic));
          break;
        case 201: // 新增/修改  完毕
          if (c) {
            // console.log(201);
            this.setTree();
            this.$gd.depository.push(b);
          }
          break;
        case 202: // 项目 新增/修改  完毕
          this.$gd.project = b.project;
          this.$gd.stock = b.stock;
          this.$formatGD(this.$gd);
          this.setTree();
          this.change(101);
          break;
        case "tree": // tree被改变
          this.setTree();
          break;
        case "CheckBox": // CheckBox被改变
          this.show0 = b;
          this.change(101);
          break;

        default:
          break;
      }
      if (a > 0 && a < 5) this.show = !this.show;
    },
    setTree() {
      this.tree = this.$gd.project.arr2tree();
      // console.log(this.$cp(this.$gd.project));
      // console.log(this.$cp(this.tree));
    },
    export(val, FileName = "导出项目库存.xlsx") {
      let data = {};
      let SheetNames = [];
      let d = this.$cp(
        this.$gd.stock.filter(i => {
          if (val) return !i.depository && i.project == val;
          else return !i.depository;
        })
      );
      let arr = this.$cp(this.$gd.stock);
      d.map((a, k) => {
        let i = 0;
        let t = this.$gd.project.getItem({ id: a.project });
        t = this.$gd.project.getItem({ id: t.pid }).name + "-" + t.name;
        while (i < arr.length) {
          if (
            arr[i].project == a.project &&
            arr[i].item == a.item &&
            arr[i].process == a.process
          ) {
            d[k].arrived += arr[i].arrived;
            d[k].use += arr[i].use;
            d[k].stock += arr[i].stock;
            arr.splice(i, 1);
            continue;
          }
          i++;
        }
        if (typeof data[t] == "undefined") {
          data[t] = [
            [
              "存货id",
              "物料id",
              "物料编号",
              "物料名称",
              "物料型号",
              "预计需求",
              "已到",
              "已用",
              "库存",
              "工序"
            ]
          ];
          SheetNames.push(t);
        }
        data[t].push([
          a.id,
          a.item,
          a.uid,
          a.name,
          a.model,
          a.sum,
          a.arrived,
          a.use,
          a.stock,
          this.$gd.process.getItem({ id: a.process }).name
        ]);
      });
      SheetNames.map(a => {
        data[a] = XLSX.utils.aoa_to_sheet(data[a]);
      });
      // console.log(data);
      // return;
      let file = XLSX.utils.book_new();
      file["SheetNames"] = SheetNames;
      file["Sheets"] = data;
      XLSX.writeFile(file, FileName);
    }
  }
};
</script>

<style lang="less" scoped>
.xxx {
  color: #f56c6c;
  color: #e6a23c;
  color: #5cb87a;
  color: #1989fa;
  color: #6f7ad3;
}
</style>
